<!--
  KPI指标卡片组件
  展示关键绩效指标的标题和数值
-->
<template>
  <div class="kpi-card">
    <h3>{{ title }}</h3>
    <p>{{ value }}</p>
  </div>
</template>

<script>
export default {
  props: {
    title: {
      type: String,
      required: true
    },
    value: {
      type: String,
      required: true
    }
  }
};
</script>

<style scoped>
.kpi-card {
  background-color: #ffffff; /* 白色背景 */
  color: #333; /* 深色文字 */
  padding: 20px;
  border-radius: 8px;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}
h3 {
  font-size: 1.2rem;
  margin-bottom: 5px;
}
p {
  font-size: 1.5rem;
  font-weight: bold;
}
</style>